<template>
	<!-- 组织会议 -->
	<CommonTitle titleName="组织会议"></CommonTitle>
	<div class="box">
		<el-form
			:inline="true"
			label-width="160"
			:model="formInline"
			:rules="rules"
			ref="formRef"
			class="demo-form-inline"
		>
			<el-row>
				<el-col :span="8" v-if="state.disabled">
					<el-form-item label="审核编号">
						<el-input
							v-model="formInline.flowId"
							disabled
							placeholder="请输入审核编号"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8" v-if="state.disabled">
					<el-form-item label="审核状态">
						<el-select
							v-model="formInline.examineStatus"
							disabled
							placeholder="请选择审核状态"
						>
							<el-option
								v-for="item in state.auditStatus"
								:key="item.value"
								:label="item.label"
								:value="item.value"
							>
							</el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="8" v-if="state.disabled">
					<el-form-item label=" ">
						<el-button type="primary" @click="openOa" class="button_edit">查看流程审批</el-button>
					</el-form-item>
				</el-col>
				<el-col :span="8"
					><el-form-item label="关联项目集">
						<el-input
							v-model="formInline.projectSetName"
							disabled
							placeholder="请输入关联项目集"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="关联项目">
						<el-input
							v-model="formInline.projectName"
							disabled
							placeholder="请输入关联项目"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="所属阶段">
						<el-input
							v-model="formInline.projectStage"
							disabled
							placeholder="请输入所属阶段"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="项目集编号">
						<el-input
							v-model="formInline.projectSetId"
							disabled
							placeholder="请输入项目集编号"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="项目编号">
						<el-input
							v-model="formInline.projectId"
							disabled
							placeholder="请输入项目编号"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="所属任务">
						<el-input
							v-model="formInline.taskName"
							disabled
							placeholder="请输入所属任务"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="项目分类">
						<el-input
							v-model="formInline.projectType"
							disabled
							placeholder="请输入项目分类"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="工作细项名称">
						<el-input
							v-model="formInline.workName"
							disabled
							placeholder="请输入工作细项名称"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="任务编号">
						<el-input
							v-model="formInline.taskCode"
							disabled
							placeholder="请输入任务编号"
						/>
					</el-form-item>
				</el-col>

				<el-col :span="8">
					<el-form-item label="项目立项部门">
						<el-input
							v-model="formInline.departmentName"
							disabled
							placeholder="请输入项目立项部门"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="项目负责人" prop="departmentUserName">
						<el-input
							disabled
							v-model="formInline.departmentUserName"
							placeholder="请输入项目负责人"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="会议名称" prop="meetingName">
						<el-input
							:disabled="state.disabled"
							v-model="formInline.meetingName"
							placeholder="请输入会议名称"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="会议所属类型" prop="meetingType">
						<el-select
							:disabled="state.disabled"
							v-model="formInline.meetingType"
							placeholder="请选择会议所属类型"
						>
							<el-option
								v-for="item in projectTendersWayList"
								:key="item"
								:label="item.label"
								:value="item.value"
							/>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="会议时间" prop="startMeetingTime">
						<el-date-picker
							v-model="formInline.startMeetingTime"
							:disabled="state.disabled"
							type="datetimerange"
							range-separator="-"
							start-placeholder="开始时间"
							end-placeholder="结束时间"
							format="YYYY-MM-DD HH:mm"
							value-format="YYYY-MM-DD HH:mm"
							:default-time="formInline.defaultTime"
							:teleported="false"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="12" v-if="isDark==='1'">
					<el-form-item label="节点时间" prop="darkStartTime">
						<el-date-picker
								v-model="formInline.darkTime"
								type="datetimerange"
								range-separator="-"
								start-placeholder="开始时间"
								end-placeholder="结束时间"
								format="YYYY-MM-DD HH:mm"
								value-format="YYYY-MM-DD HH:mm"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="会议地点" prop="meetingAddress">
						<el-input
							:disabled="state.disabled"
							v-model="formInline.meetingAddress"
							placeholder="请输入会议地点"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="会议简述" prop="meetingContext">
						<el-input
							:disabled="state.disabled"
							v-model="formInline.meetingContext"
							type="textarea"
							placeholder="请输入会议简述"
						/>
					</el-form-item>
				</el-col>
				<el-col :span="24" v-if="state.disabled">
					<el-form-item label="会议纪要" prop="meetingContent">
						<el-input
							disabled
							v-model="formInline.meetingContent"
							type="textarea"
							placeholder="请输入会议纪要"
						/>
					</el-form-item>
				</el-col>
				<!-- <el-col :span="24" v-if="state.disabled">
					<el-form-item label="用途" prop="purpose">
						<el-input
							disabled
							v-model="formInline.purpose"
							type="textarea"
							placeholder=""
						/>
					</el-form-item>
				</el-col> -->
				<el-col :span="24">
					<el-form-item label="相关附件" prop="files">
						<FileMinioUpload
							:disabled="state.disabled"
							:restriction="true"
							:restrictionLimit="9"
							@updateFiles="updateFiles"
							v-model:files="formInline.files"
							:showButton="!state.disabled"
						/>
					</el-form-item>
				</el-col>
				<!-- 选择人员 -->
				<!-- 开发建设部 -->
				<el-col :span="6">
					<el-form-item label="与会人员(多选)" required>
						<el-select
							disabled
							v-model="formInline.departmentsId[0]"
							placeholder="开发建设部"
							@change="changeParticipants"
						>
							<el-option
								v-for="item in state.departmentList"
								:key="item.departmentId"
								:label="item.departmentName"
								:value="item.departmentId"
							/>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="18">
					<el-form-item label="">
						<el-select
							:disabled="state.disabled"
							v-model="formInline.buildParticipants"
							placeholder=""
							multiple
						>
							<el-option
								v-for="item in state.biddingCategoryList"
								:key="item.userId"
								:label="item.userName"
								:value="item.userId"
							/>
						</el-select>
					</el-form-item>
				</el-col>
				<!-- 开发建设部 -->
				<!-- 投资发展部 -->
				<el-col :span="6">
					<el-form-item label=" ">
						<el-select
							disabled
							v-model="formInline.departmentsId[1]"
							placeholder=""
						>
							<el-option
								v-for="item in state.departmentList"
								:key="item.departmentId"
								:label="item.departmentName"
								:value="item.departmentId"
							/>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="18">
					<el-form-item label="">
						<el-select
							:disabled="state.disabled"
							v-model="formInline.investParticipants"
							placeholder=""
							multiple
						>
							<el-option
								v-for="item in state.investPeopleList"
								:key="item.userId"
								:label="item.userName"
								:value="item.userId"
							/>
						</el-select>
					</el-form-item>
				</el-col>
				<!-- 投资发展部 -->
				<!-- 招标合约部 -->
				<el-col :span="6">
					<el-form-item label=" " prop="participants">
						<el-select
							disabled
							v-model="formInline.departmentsId[2]"
							placeholder=""
						>
							<el-option
								v-for="item in state.departmentList"
								:key="item.departmentId"
								:label="item.departmentName"
								:value="item.departmentId"
							/>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="18">
					<el-form-item label="">
						<el-select
							:disabled="state.disabled"
							v-model="formInline.tendersParticipants"
							placeholder=""
							multiple
						>
							<el-option
								v-for="item in state.callForBidsPeopleList"
								:key="item.userId"
								:label="item.userName"
								:value="item.userId"
							/>
						</el-select>
					</el-form-item>
				</el-col>
				<!-- 招标合约部 -->
				<!-- 全部人员 -->
				<el-col :span="24" v-if="!state.disabled">
					<el-form-item label=" ">
						<el-button type="primary" size="mini" @click="addMeetingDepartment" class="button_edit">
							新增参会部门
						</el-button>
					</el-form-item>
				</el-col>

				<el-col
					:span="24"
					v-for="item in formInline.departmentList"
					:key="item"
				>
					<el-form-item label=" ">
						<el-col :span="3.1">
							<el-input disabled v-model="item.departmentName" placeholder="" />
						</el-col>
						<el-col :span="15">
							<el-input disabled v-model="item.userName" placeholder="" />
						</el-col>
						<el-col
							:span="2"
							v-if="!state.disabled"
							style="display: flex; justify-content: space-between"
						>
							<el-button
								type="primary"
								size="mini"
								@click="addMettingPeople(item)"
                class="button_edit"
							>
								添加参会人员</el-button
							>
							<el-button type="primary" size="mini" @click="deletePeople(item)" class="button_delete2">
								移除</el-button
							>
						</el-col>
					</el-form-item>
				</el-col>
				<!-- 全部人员 -->
				<el-col :span="24">
					<CommonTitle titleName="其他信息"></CommonTitle>
				</el-col>

				<el-col :span="8">
					<el-form-item label="申请人">
						<el-input disabled v-model="formInline.createName" placeholder="" />
					</el-form-item>
				</el-col>

				<el-col :span="8">
					<el-form-item label="申请部门">
						<el-input
							disabled
							v-model="formInline.createDepartmentName"
							placeholder=""
						/>
					</el-form-item>
				</el-col>
				<el-col :span="8">
					<el-form-item label="创建时间">
						<el-input disabled v-model="formInline.createTime" placeholder="" />
					</el-form-item>
				</el-col>
				<el-col :span="24" v-if="!state.disabled">
					<el-button v-if="isDark==='1' && getURLhandler(route.path).status ==='2'" @click="updateMeeting" type="primary" class="button_view">修改</el-button>
					<el-button v-else @click="submit" type="primary" class="button_view">{{isDark==='1'?'保存':'发起审批'}}</el-button>
					<el-button type="primary" @click="goback" class="button_cancel2"> 取消 </el-button>
				</el-col>
			</el-row>
		</el-form>
		<MeetingDepartment
			ref="meetingDepartment"
			@submitRow="submitRow"
		></MeetingDepartment>
		<MeetingPeople
			ref="meetingPeople"
			@submitRow="submitRowPeople"
		></MeetingPeople>
	</div>
</template>

<script setup>
import {businessApi, darkLine, department, organizeAmeeting} from "@/api/project";
import { ref, reactive, onBeforeMount, onMounted } from "vue";
import {
	ElDialog,
	ElForm,
	ElDatePicker,
	ElFormItem,
	ElRow,
	ElCol,
	ElMessage,
	ElSwitch,
} from "element-plus";
import CommonTitle from "@/components/CommonTitle.vue";
import FileMinioUpload from "@/components/FileMinioUpload.vue";
import { useRouter, useRoute } from "vue-router";
import {
	getURLhandler,
	nanoid,
} from "@/views/constructionProjectManage/static/utools.js";
//参会部门人员dialog
import MeetingDepartment from "./departmentDialog.vue";
//参会部门对应人员
import MeetingPeople from "./peopleDialog.vue";


let router = useRouter();
let route = useRoute();
const meetingDepartment = ref(null);
const meetingPeople = ref(null);

const isDark = getURLhandler(route.path).isDark;
const isLook = getURLhandler(route.path).isLook;

const formInline = reactive({
	files: [],
	examineStatus: "",
	flowId: "",
	routeUrl: "",
	departmentsId: [],
	meetingName: "",
	startMeetingTime: [],
	defaultTime: ["2023-07-05 00:00", "2023-07-05 23:59"],
	departmentList: [
		{
			departmentId: "",
			departmentName: "",
			userName: "",
			nanoid: nanoid(),
			userId: "",
		},
	],
	approvalOpinion: "",
});
const state = reactive({
	participantsDepartmentList: [],
	auditStatus: [
		{
			label: "待审核",
			value: "1",
		},
		{
			label: "审核成功",
			value: "2",
		},
		{
			label: "审核驳回",
			value: "3",
		},
	],
	investPeopleList: [],
	callForBidsPeopleList: [],
	biddingCategoryList: [],
	projectTaskId: "",
	projectId: "",

	disabled: false,
	itemId: "",
});
const rules = {
	meetingName: [
		{ required: true, message: "会议名称不能为空", trigger: "blur" },
	],
	meetingType: [
		{ required: true, message: "会议类型不能为空", trigger: "blur" },
	],
	meetingAddress: [
		{ required: true, message: "会议地点不能为空", trigger: "blur" },
	],
	startMeetingTime: [
		{ required: true, message: "会议时间不能为空", trigger: "blur" },
	],
	darkTime: [
		{ required: true, message: "节点时间不能为空", trigger: "blur" },
	],
	meetingContext: [
		{ required: true, message: "会议内容不能为空", trigger: "blur" },
	],

	purpose: [{ required: true, message: "用途不能为空", trigger: "blur" }],

	files: [{ required: true, message: "相关文件不能为空", trigger: "blur" }],
};
const updateFiles = () => {};
const goback = () => {
	router.go(-1);
};
const projectTendersWayList = reactive([
	{
		label: "招标项目",
		value: "-5403873840876272513",
	},
	{
		label: "投资项目",
		value: "6597315479569055834",
	},
	{
		label: "建设项目",
		value: "960330435988177277",
	},
	{
		label: "其他项目",
		value: "-2375352083915127206",
	},
]);

const formRef = ref(null);
const submit = () => {
	formRef.value.validate( (valid, fields) => {
		if (valid) {
			if (formInline.files.length == 0) {
				ElMessage.error("请上传相关附件");
				return;
			}

			if (formInline.buildParticipants.length == 0) {
				ElMessage.error("请选择开发建设单位参会人员");
				return;
			}
			if (formInline.tendersParticipants.length == 0) {
				ElMessage.error("请选择招标单位参会人员");
				return;
			}
			if (formInline.investParticipants.length == 0) {
				ElMessage.error("请选择投资单位参会人员");
				return;
			}

			formInline.projectId = state.projectId;
			formInline.taskId = state.projectTaskId;
			let obj = JSON.parse(JSON.stringify(formInline));
			obj.startMeetingTime = formInline.startMeetingTime[0];
			obj.endMeetingTime = formInline.startMeetingTime[1];
			obj.type = "-8533225537650931090";
			obj.itemId = state.itemId;

			if(formInline.darkTime && Array.isArray(formInline.darkTime)){
				obj.darkStartTime = formInline.darkTime[0];
				obj.darkEndTime = formInline.darkTime[1];
			}

			if(getURLhandler(route.path).isDark && getURLhandler(route.path).isDark==='1'){
				darkLine.addMeeting(obj).then((res) => {
					if (res.code === "200") {
						ElMessage.success("操作成功");
						router.go(-1);
					}
				});
			}else{
				organizeAmeeting.save(obj).then((res) => {
					if (res.code === "200") {
						ElMessage.success("操作成功");
						router.go(-1);
					}
				});
			}
		}
	});
};

/**
 * 修改会议
 */
const updateMeeting = () => {
	formRef.value.validate( (valid, fields) => {
		if (valid) {
			if (formInline.files.length === 0) {
				ElMessage.error("请上传相关附件");
				return;
			}

			if (formInline.buildParticipants.length === 0) {
				ElMessage.error("请选择开发建设单位参会人员");
				return;
			}
			if (formInline.tendersParticipants.length === 0) {
				ElMessage.error("请选择招标单位参会人员");
				return;
			}
			if (formInline.investParticipants.length === 0) {
				ElMessage.error("请选择投资单位参会人员");
				return;
			}

			formInline.projectId = state.projectId;
			formInline.taskId = state.projectTaskId;
			let obj = JSON.parse(JSON.stringify(formInline));
			obj.startMeetingTime = formInline.startMeetingTime[0];
			obj.endMeetingTime = formInline.startMeetingTime[1];
			obj.type = "-8533225537650931090";
			obj.itemId = state.itemId;

			if(formInline.darkTime && Array.isArray(formInline.darkTime)){
				obj.darkStartTime = formInline.darkTime[0];
				obj.darkEndTime = formInline.darkTime[1];
			}

			darkLine.addMeeting(obj).then((res) => {
				if (res.code === "200") {
					ElMessage.success("操作成功");
					router.go(-1);
				}
			});

		}
	});
}

//添加部门
const submitRow = (data) => {
	if (!formInline.departmentList) {
		formInline.departmentList = [];
	}
	let obj = {
		departmentId: data.departmentId,
		departmentName: data.departmentName,
		userName: "",
		nanoid: nanoid(),
		userId: "",
	};

	formInline.departmentList.push(obj);
};
const submitRowPeople = (data) => {
	let { list, id } = data;
	if (list.length == 0) {
		ElMessage.error("请选择人员");
		return;
	}
	formInline.departmentList.forEach((item) => {
		if (item.nanoid == id) {
			item.userName = list.map((item) => item.userName).join(",");
			item.userId = list.map((item) => item.userId).join(",");
		}
	});
};
//添加人员
const addMettingPeople = (item) => {
	if (!item.departmentId) {
		ElMessage.error("请先选择部门");
		return;
	}
	meetingPeople.value.state.dialogVisible = true;
	meetingPeople.value.state.id = item.nanoid;
	meetingPeople.value.state.departmentId = item.departmentId;
};
const deletePeople = (item) => {
	formInline.departmentList = formInline.departmentList.filter(
		(items) => items.nanoid != item.nanoid
	);
};
const getAllDepartment = (param) => {
	department.getAllDepartments(param).then((res) => {
		if (res.code == "200") {
			state.departmentList = res.data;
		}
	});
};
//选择部门
const addMeetingDepartment = () => {
	meetingDepartment.value.state.dialogVisible = true;
};

//获取开放建设部门
const getDepartmentPeople = (id = "") => {
	department.getUserByDepartmentId(id).then((res) => {
		if (res.code == "200") {
			state.biddingCategoryList = res.data;
		}
	});
};
//获取投资部门
const getinvestDepartmentPeople = (id = "") => {
	department.getUserByDepartmentId(id).then((res) => {
		if (res.code == "200") {
			state.investPeopleList = res.data;
		}
	});
};

//招标部门
const changeBiddingCategory = (val) => {
	department.getUserByDepartmentId(val).then((res) => {
		if (res.code == "200") {
			state.callForBidsPeopleList = res.data;
		}
	});
};
//选择部门变化
const changeParticipantsDepartment = (val) => {
	department.getUserByDepartmentId(val).then((res) => {
		if (res.code == "200") {
			state.participantsDepartmentList = res.data;
		}
	});
};
const changeParticipants = (val) => {
	//获取部门人员
	getDepartmentPeople(val);
};

onBeforeMount(() => {
	state.projectTaskId = getURLhandler(route.path).projectTaskId;
	state.projectId = getURLhandler(route.path).projectId;
	state.disabled = +getURLhandler(route.path).isLook;
	state.itemId = getURLhandler(route.path).itemId;

	// departmentId
});

const openOa = () => {
	window.open(formInline.routeUrl);
};

onMounted(() => {
	organizeAmeeting
			.getInfo({
				taskId: state.projectTaskId,
				itemId: state.itemId,
				projectId: state.projectId,
			})
			.then((res) => {
				if (res.code === "200") {
					// console.log(res.data, "ssss");
					//获取部门人员
					getDepartmentPeople(res.data.departmentId);
					//获取部门
					getAllDepartment();

					for (const key in res.data) {
						if (key === "startMeetingTime") {
							if (!res.data[key]) {
								let year = new Date().getFullYear();
								let month = new Date().getMonth() + 1;
								if (month < 10) {
									month = "0" + month;
								}
								let day = new Date().getDate();
								if (day < 10) {
									day = "0" + day;
								}
								formInline[key] = [
									`${year}-${month}-${day} 00:00`,
									`${year}-${month}-${day} 23:59`,
								];
							} else {
								formInline[key] = [res.data[key], res.data["endMeetingTime"]];
							}
							continue;
						}
						if (
								key === "files" ||
								key === "buildParticipants" ||
								key === "investParticipants" ||
								key === "tendersParticipants" ||
								key === "participants"
						) {
							formInline[key] = res.data[key] || [];
							continue;
						}
						if (key === "departmentsId") {
							formInline[key] = res.data[key].split(",");

							changeParticipants(formInline[key][0]); //建设部门人员
							getinvestDepartmentPeople(formInline[key][1]); //投资部门人员
							changeBiddingCategory(formInline[key][2]); //招标部门人员
							continue;
						}
						if (key === "departmentList") {
							// changeParticipantsDepartment(res.data[key]) //参会部门人员
							formInline[key] = res.data[key] || [];
							continue;
						}
						if(key === 'darkStartTime'){
							formInline['darkTime'] = [res.data[key],res.data['darkEndTime']];
						}
						formInline[key] = res.data[key] || "";
					}
				}
			});
});
</script>

<style lang="scss" scoped>
.el-form-item,
.el-select {
	width: 100%;
}
.box {
	border-radius: 10px;
	border: 1px solid #e3e7f1;
	padding: 34px 90px;
}
:deep(.el-date-range-picker) {
	.el-time-panel {
		.el-time-spinner .el-time-spinner__wrapper {
			&:nth-child(1) {
				width: 50%;
			}
			&:nth-child(2) {
				width: 50%;
			}
			&:nth-child(3) {
				display: none;
			}
		}
	}
}
</style>
